<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib uri="http://shiro.apache.org/tags" prefix="shiro"%>
<c:set var="contextPath" value="${pageContext.request.contextPath}"></c:set>
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>成员信息</title>
    <meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0" name="viewport"/>
    <meta content="yes" name="apple-mobile-web-app-capable"/>
    <meta content="black" name="apple-mobile-web-app-status-bar-style"/>
    <meta content="telephone=no" name="format-detection"/>
</head>
<style type="text/css">
    /* 公共样式表css */
    html,body {
        color: #333;
        margin: 0;
        height: 100%;
        font-family: "Myriad Set Pro","Helvetica Neue",Helvetica,Arial,Verdana,sans-serif;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        font-weight: normal;
    }

    * {
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }

    a {
        text-decoration: none;
        color: #000;
    }

    a, label, button, input, select {
        -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    }

    img {
        border: 0;
    }

    body {
        background: #f3f4f5;
        color: #666;
    }

    html, body, div, dl, dt, dd, ol, ul, li, h1, h2, h3, h4, h5, h6, p, blockquote, pre, button, fieldset, form, input, legend, textarea, th, td {
        margin: 0;
        padding: 0;
    }

    a {
        text-decoration: none;
        color: #08acee;
    }

    button {
        outline: 0;
    }

    img {
        border: 0;
    }

    button,input,optgroup,select,textarea {
        margin: 0;
        font: inherit;
        color: inherit;
        outline: none;
    }

    li {
        list-style: none;
    }

    a {
        color: #666;
    }

    .clearfix::after {
        clear: both;
        content: ".";
        display: block;
        height: 0;
        visibility: hidden;
    }

    .clearfix {
    }

    /* 必要布局样式css */
    .aui-flexView {
        width: 100%;
        height: 100%;
        margin: 0 auto;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .aui-scrollView {
        width: 100%;
        height: 100%;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
        overflow-y: auto;
        overflow-x: hidden;
        -webkit-overflow-scrolling: touch;
        position: relative;
        /* margin-top: -44px; */
    }

    .aui-navBar {
        height: 44px;
        position: relative;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        z-index: 1002;
        background: #ffffff;
    }

    .aui-navBar:after {
        content: '';
        position: absolute;
        z-index: 2;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 1px;
        border-bottom: 1px solid #e5e5e5;
        -webkit-transform: scaleY(0.5);
        transform: scaleY(0.5);
        -webkit-transform-origin: 0 100%;
        transform-origin: 0 100%;
    }

    .aui-navBar-item {
        height: 44px;
        min-width: 25%;
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 25%;
        -ms-flex: 0 0 25%;
        flex: 0 0 25%;
        padding: 0 0.9rem;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        font-size: 0.7rem;
        white-space: nowrap;
        overflow: hidden;
        color: #878787;
        position: relative;
    }

    .aui-navBar-item:first-child {
        -webkit-box-ordinal-group: 2;
        -webkit-order: 1;
        -ms-flex-order: 1;
        order: 1;
        margin-right: -25%;
        font-size: 0.9rem;
        font-weight: bold;
    }

    .aui-navBar-item:last-child {
        -webkit-box-ordinal-group: 4;
        -webkit-order: 3;
        -ms-flex-order: 3;
        order: 3;
        -webkit-box-pack: end;
        -webkit-justify-content: flex-end;
        -ms-flex-pack: end;
        justify-content: flex-end;
    }

    .aui-center {
        -webkit-box-ordinal-group: 3;
        -webkit-order: 2;
        -ms-flex-order: 2;
        order: 2;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        height: 44px;
        width: 50%;
        margin-left: 25%;
    }

    .aui-center-title {
        text-align: center;
        width: 100%;
        white-space: nowrap;
        overflow: hidden;
        display: block;
        text-overflow: ellipsis;
        font-size: 0.95rem;
        color: #3c3c3c;
    }

    .icon {
        width: 20px;
        height: 20px;
        display: block;
        border: none;
        float: left;
        background-size: 20px;
        background-repeat: no-repeat;
    }



    .aui-order-title {
        padding: 15px;
    }

    .aui-order-title h2 {
        color: #999999;
        font-size: 0.85rem;
        font-weight: normal;
        padding-bottom: 15px;
    }

    .aui-order-box {
        margin-bottom: 10px;
        border-radius: 2px;
        background: #ffffff;
        padding: 15px 15px 10px 15px;
        box-shadow: 0 1px 16px 0 rgba(0,0,0,.1);
    }

    .aui-well-item {
        padding: 0;
        position: relative;
        display: -webkit-box;
        display: -webkit-flex;
        display: flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        align-items: center;
        margin-bottom: 10px;
    }

    .aui-well-item-bd {
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        flex: 1;
        min-width: 0;
    }

    .aui-well-item-bd h3 {
        color: #FC9153;
        font-size: 1.3rem;
        font-weight: normal;
    }

    .aui-well-item-fr {
        font-size: 0.8rem;
        text-align: right;
        color: #999999;
        padding-right: 13px;
        position: relative;
    }


    .aui-order-fl {
        color: #666666;
        font-size: 1.0rem;
        margin-bottom: 10px;
        position: relative;
        overflow: hidden;
        padding-left: 0px;
    }
</style>
<body>
<section class="aui-flexView">
    <header class="aui-navBar aui-navBar-fixed">
        <a href="javascript:;" class="aui-navBar-item">
            <i class="icon icon-return"></i>
        </a>
        <div class="aui-center">
            <span class="aui-center-title">成员信息</span>
        </div>

    </header>
    <section class="aui-scrollView">
        <div class="aui-order-title" >
            <div id="app">
                <div class="aui-order-box"  v-for="site in orderList">
                    <a href="javascript:void(0);" class="aui-well-item">
                        <div class="aui-well-item-bd">
                            <h3>{{site.CUST_ADDR}}</h3>
                        </div>
                        <%--<span class="aui-well-item-fr">{{site.CUST_ORDER_LEVEL}}</span>--%>
                    </a>
                    <%--<p class="aui-order-fl aui-order-time">{{site.CUST_NAME}}</p>--%>
                    <%--<p class="aui-order-fl aui-order-address">{{site.SLSMAN_CODE}}</p>--%>
                    <%--<p class="aui-order-fl aui-order-door">{{site.SLSMAN_NAME}}</p>--%>
                </div>
            </div>
        </div>
    </section>
</section>

<script src="${contextPath}/static/statistics/js/jquery.js"></script>
<script src="${contextPath}/static/statistics/js/vue.js"></script>
<script>
    var groupId = "${groupId}";
    var dataList ;
    var app =new Vue({
        el: '#app',
        data: {
            orderList:[],
        }
    });
    (function($) {
        $.ajax({
            type : "post",
            url : "${contextPath}/Honest/queryGroupInfo",
            async : false,
            data : {
                "groupId" : groupId,
            },
            success : function(data) {
                var dataArray = data.data;
                app.orderList=dataArray;
            },
            error : function() {
                console.log('fail')
            }
        });
    }) (jQuery);


</script>
</body>
</html>
